﻿.wrapper{
    height:100%;
    position:relative;
}
/*-----------Content------------*/
.content
{
	/*
    height:calc(100% - 20px);
     padding:10px; 
    position:relative;
	*/
	
	
	margin-top: 8px;
	margin-left: 8px;
	margin-right: 8px;
	margin-bottom: 8px;
	
	background-color: #FFF;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px; 
	border:3px solid #6c6f70;
	background:#FFFFFF;
	-moz-box-shadow:    3px 3px 5px 6px #ccc;
  	-webkit-box-shadow: 3px 3px 5px 6px #ccc;
  	/* box-shadow:     0px 0px 0px 0px #FFF, 0 0 15px 15px rgba(130, 130, 130, 0.1); */
	box-shadow: 0px 0px 5px 5px rgba(255, 255, 255, 0.4); 
	position:relative;
	height:calc(100% - 20px);
}

.content iframe
{
    width:100%;
    height:100%;
    border-radius:5px;
}
.varscreen-container
{
    position:absolute;
    top:53px;
    width:calc(100% - 54px);
    height:calc(100% - 65px);
    margin:0 20px;
    border-radius:5px;
    display:none;
    margin-top:-9px;
    margin-left:11px; 
    margin-right:10px;
}
.varscreen-container iframe
{
     height:100%;
}
.top-links
{
    position:absolute;
    top:7px;
    right:3px;
    z-index:1;
}
.top-links ul li
{
    float:left;
    margin-right:7px;
	margin-top:20px;
}
.top-links ul li a
{
    width:18px;
    height:18px;
    display:block;
    background: url(../images/icon-topcontent.png) left 0px no-repeat transparent;
}
.top-links a.icon-varscreen
{
    background-position:0px 0px;
}
.top-links a.icon-varscreen:hover,.top-links a.icon-varscreen-active
{
    background-position:0px -24px;
}
.top-links a.icon-favourites
{
    background-position:-27px 1px;
}
.top-links a.icon-favourites:hover
{
    background-position:-27px -24px;
}

/*-----------Tab Content---------*/
.tabs
{
    height:100%; 
}

.tabs ul.tab-title
{
    overflow:hidden;
	margin-top:10px;
	margin-left:15px;
    height: 23px;
    width:calc(100% - 40px);
}
.tabs ul.tab-title li
{
    float:left;
    position:relative;
}
.tabs ul.tab-title li a {
    background: url(../images/tab_title-R.png) right -30px no-repeat transparent;
    display: inline-block;
    padding-right: 22px;
    height: 23px;
	color: #fd8c07;
}
.tabs ul.tab-title li a span
{
   background: url(../images/tab_title-L.png) left -30px no-repeat transparent;
    display:block;
    line-height:24px;
    height:23px;
    padding:0px 10px 0px 12px;
    overflow:hidden;
	color: #000000;
}

.tabs ul.tab-title li a:hover,.tabs ul.tab-title li.ui-tabs-active a
{
    background-position: right -3px;

}
.tabs ul.tab-title li a:hover span,.tabs ul.tab-title li.ui-tabs-active a span
{
    background-position:left  -3px;
	color: #FFFFFF;
}

.tabs .ui-icon-close
{
    position:absolute;
    top:5px;
    right:12px;
    color:#ffffff;
    cursor:pointer;
    display:block;
    width:12px;
    height:12px;
    border-radius:6px;
    background-color:#999;
    line-height:10px;
    text-align:center;
}
.tabs .ui-icon-close:hover
{
    color:#00FF00;
    background-color:#ffffff;
}
.tabs .tab-content
{
    background-color:rgba(255,255,255,0.4);
    width:100%;
    height:calc(100% - 40px);
	
	/* 
	box-shadow: rgba(36,143,170,0.4) 0px 10px 10px; 
	
	box-shadow: rgba(0,0,0,0.4) 0px 1px 1px;
	
    border-radius:0 5px 5px 5px;
	*/
}



.tabs .tab-content .tab-content-inner
{
	margin-top:-1px;
	margin-right:5px;
	margin-bottom:5px;
	margin-left:15px;
	
	padding-top:0px;	
	padding-right:10px;
	padding-bottom:5px;
	padding-left:15px;
  
    width:calc(100% - 60px);
	height: calc(100% - 10px);
	

	
    display:inline-block;
    border-radius:5px;
    border:1px solid #6c6f70;
	
	/* box-shadow: rgba(36,143,170,0.4) 0px 0px 10px; */
	
	box-shadow: 0px 1px 4px rgba(0,0,0,0.5), inset 0px 0px 20px rgba(0,0,0,0.5);
}


.tabs .ui-tabs .ui-state-disabled
{
    display: none; /* disabled tabs don't show up */
}
.tabs .ui-tabs-panel
{
    width:100%;
    height:100%;
}
.tabs iframe
{
    width:100%;
    height:calc(100% - 50px);

}

/*-----------Footer---------------*/
.footer
{
     position:absolute;
     bottom:0px;
     height:35px;
     width:100%;
     background: url(../images/footer-bg.png) 0px 0px repeat-x transparent;
}
.credits-cover {
    bottom: 0;
    z-index: 1;
    width: 100%;
    height:35px;
    position: absolute;
}
.credits {
    margin: 0 auto;
    width: 400px;
    height:35px;
    background: url(../images/credits-bg.png);
}
.footer {
}
.footer .copyright {
    float: left;
    width: 40%;
    padding-top:7px;
    padding-left:10px;
}
.footer .copyright p {
    color: #5C8EA6;
}
.footer .copyright a {
    color: #ffffff;
}
.footer .copyright a:hover {
    color: #33CCCC;
}

.footer .bottom-links {
    float: right;
    width: 40%;
    padding-top:7px;
    padding-right:10px;
}
.footer .bottom-links ul {
    float: right;
}
.footer .bottom-links ul li {
    float: left;
    padding-left: 30px;
}
.footer .bottom-links ul li a {
    color: #5C8EA6;
}
.footer .bottom-links ul li a:hover {
    color: #ffffff;
}


